<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>福建东侨政府网</title>
<meta name="Keywords" content="上传个人图像">
<link href="css/main.css" rel="stylesheet" type="text/css">
<link href="css/index.css" rel="stylesheet" type="text/css">
<script src="js/jquery-1.10.2.min.js"></script>
<script type="<%=basePath%>text/javascript">
			$(function(){
				$("#myFile").change(function() {
					var img_div = $(".img_div");
					var filepath = $("input[name='myFile']").val();
					for(var i = 0; i < this.files.length; i++) {
						objUrl = getObjectURL(this.files[i]);
						var extStart = filepath.lastIndexOf(".");
						var ext = filepath.substring(extStart, filepath.length).toUpperCase();

						if(ext != ".BMP" && ext != ".PNG" && ext != ".GIF" && ext != ".JPG" && ext != ".JPEG") {
							$(".shade").fadeIn(500);
							$(".text_span").text("图片限于bmp,png,gif,jpeg,jpg格式");
							this.value = "";
							$(".img_div").html("");
							return false;
						} else {
							/*
							 若规则全部通过则在此提交url到后台数据库
							 * */
							img_html = "<div class='isImg'><img src='" + objUrl + "' onclick='javascript:lookBigImg(this)' style='height: 100%; width: 100%;' /><button class='removeBtn' onclick='javascript:removeImg(this)'>x</button></div>";
							img_div.append(img_html);
						}
					}

					var file_size = 0;
					var all_size = 0;
					for(j = 0; j < this.files.length; j++) {
						file_size = this.files[j].size;
						all_size = all_size + this.files[j].size;
						var size = all_size / 1024;
						if(size > 500) {
							$(".shade").fadeIn(500);
							$(".text_span").text("上传的图片大小不能超过100k！");
							this.value = "";
							$(".img_div").html("");
							return false;
						}
					}

		});
</script>
</head>
<body>
	<jsp:include page="/jsp/top.jsp"></jsp:include>
	<div class="yc_container">
	 <div class="yc_location">当前位置 &gt; 个人图像上传</div> 
			<form action="guest/uploadPictureSave.do" method="post" enctype="multipart/form-data">
				<div style="height: 400px;width:600px;border:1px solid #FF910C;margin:0  auto;">
				</div>
				<div style="margin-left: 400px;height: 50px;margin-top: 10px;">
						<input type="file" name="picture" id="picture" multiple="multiple" >
						<a href="javascript:;" class="a-upload" style="color: red;">
							<input type="file" name="myFile" id="myFile" multiple="multiple" />点击这里上传文件
					</a>
				</div>
			</form>
	</div>
	<jsp:include page="/jsp/bottom.jsp"></jsp:include>
</body>
</html>
